<template>
  <div class="app-container">
    <div  class="box">
      <span class="l_title">分数以及结果</span>
      <el-row  class="infolist infolist_top">
        <el-col :span="6">风险分数：{{item.final_score}}</el-col>
        <el-col :span="6">决策结果：{{item.final_decision}}</el-col>
      </el-row>
    </div>
    <el-divider></el-divider>
 <!-- <el-divider content-position="center">风险项目</el-divider> -->
  <div  class="box">
    <span class="l_title">风险项目</span>
    <el-table :data="item.risk_items" style="width: 100%;margin-left:10px;margin-top:15px;text-align:center" border size="mini" >
      <el-table-column prop="risk_name" label="规则名称" align="center"></el-table-column>
      <el-table-column label="不分维度关联多平台">
         <template slot-scope="{row}">
            <span v-for="(item,index) in row.risk_detail"> <span v-for="(detail,inx) in item.platform_detail">{{detail.industry_display_name}}({{detail.count}})<br></span></span>
         </template>
       </el-table-column>
       <el-table-column label="各维度关联多平台">
          <template slot-scope="{row}">
            <span v-for="(item,index) in row.risk_detail">
              <span v-for="(dimension,idx) in item.platform_detail_dimension">{{dimension.dimension}}:<br><span v-for="(dimension_detail,idxs) in dimension.detail">{{dimension_detail.industry_display_name}}({{dimension_detail.count}})<br></span></span></span>
          </template>
        </el-table-column>
       <el-table-column prop="rule_id" label="规则编号"  align="center"></el-table-column>
       <el-table-column prop="score" label="风险分数"  align="center"></el-table-column>
       <el-table-column prop="decision" label="决策结果"  align="center"></el-table-column>
       <el-table-column prop="policy_decision" label="策略决策结果"  align="center"></el-table-column>
       <el-table-column prop="policy_mode" label="策略模式" align="center"></el-table-column>
       <el-table-column prop="policy_score" label="策略分数"  align="center"></el-table-column>
       <el-table-column prop="policy_name" label="策略名称"  align="center"></el-table-column>
    </el-table>
  </div>
</div>

</template>

<script>
  import {
    getTongdunData
  } from '@/api/order'
  export default {
    data() {
      return {
        item:{
          final_score:0,
          final_decision:'',
          risk_items:[],
        },
        final_score:0,
        final_decision:"",
        risk_items: {}
      }
    },
    created() {
      let order_id = this.$route.params.order_id;
      this.getTongdunData(order_id)
    },
    methods: {
      getTongdunData(order_id) {
        getTongdunData(order_id).then(resp => {
          console.log(Object.values(resp));
         // this.final_score = resp.data.result_desc.ANTIFRAUD.final_score
         // this.final_decision =resp.data.result_desc.ANTIFRAUD.final_decision
         // this.risk_items = resp.data.result_desc...risk_items
          this.item=resp.data.result_desc.ANTIFRAUD
        })
      }
    }
  }
</script>

<style>
  .app-container{font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;}
  .infolist_top{margin-top:12px;}
  .infolist{color:#999;font-size:13px;margin-left: 10px;}
  .l_title{font-size:14px;}
  .box{margin-left:50px;margin-right: 50px;}
</style>
